import { lazy, useState, useRef, Suspense, memo } from 'react'
import { useSelector } from 'react-redux'
import LdMainContainer from '../../components/LdMainContainer'
const SecretLevel = lazy(() => import('./components/SecretLevel'))
const SystemParameter = lazy(() => import('./components/SystemParameter'))
const EquipmentManagement = lazy(() => import('./components/EquipmentManagement'))
const UserManagement = lazy(() => import('./components/UserManagement'))
const PowerManage = lazy(() => import('./components/PowerManage'))
const BarCodeManage = lazy(() => import('./components/BarCodeManage'))
const System = () => {
    const { permission = 0 } = useSelector((state: any) => state.userReducer.userInfo)
    const menuList = [
        {
            label: "用户管理",
            icon: "UserManagement",
            hidden: permission !== 2,
            key: "UserManagement",
            count: 0,
        },
        {
            label: "涉密等级",
            icon: "UserManagement",
            hidden: permission !== 2,
            key: "SecretLevel",
            count: 0,
        },
        {
            label: "设备管理",
            icon: "EquipmentManagement",
            hidden: permission !== 3,
            key: "EquipmentManagement",
            count: 0,
        },
        {
            label: "系统参数",
            icon: "SystemParameter",
            hidden: permission !== 3,
            key: "SystemParameter",
            count: 0,
        },
        {
            label: "条码设置",
            icon: "BarCodeManage",
            hidden: permission !== 3,
            key: 'BarCodeManage',
            count: 0,
        },
        {
            label: "权限管理",
            icon: "PowerManage",
            hidden: permission !== 2,
            key: "PowerManage",
            count: 0
        }
    ]
    const newArray = menuList.filter((r) => !r.hidden)
    const [defaultKey, setDefaultKey] = useState<string>(newArray.length ? newArray[0].key : '')
    const handleRoute = (data: any) => {
        setDefaultKey(data.key)
    }
    return (
        <>
            <LdMainContainer defaultKey={defaultKey} menus={newArray} change={handleRoute}>
                <Suspense fallback={<>loading</>}>
                    {
                        defaultKey === 'SecretLevel' ?
                            <SecretLevel /> : defaultKey === 'EquipmentManagement' ?
                                <EquipmentManagement /> : defaultKey === 'SystemParameter' ?
                                    <SystemParameter /> : defaultKey === 'PowerManage' ?
                                        <PowerManage /> : defaultKey === 'BarCodeManage' ?
                                            <BarCodeManage /> : <UserManagement />
                    }
                </Suspense>
            </LdMainContainer>
        </>
    )
}
export default memo(System)